/*
 * @Author: wu07 1732042133@qq.com
 * @Date: 2023-02-22 16:00:52
 * @LastEditors: wu07 1732042133@qq.com
 * @LastEditTime: 2023-02-23 15:43:16
 * @FilePath: \JoyTravel\travel\src\views\Index\index.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
/*
 * @Author: wu07 1732042133@qq.com
 * @Date: 2023-02-22 16:00:52
 * @LastEditors: wu07 1732042133@qq.com
 * @LastEditTime: 2023-02-23 10:38:13
 * @FilePath: \悦旅\JoyTravel\travel\src\views\Index\index.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import React from 'react'
import { Search, Swiper, Image, Rate } from 'react-vant';
import { images } from './images'
import '../css/index.css'
import { Like } from '@react-vant/icons'
import { LikeO } from '@react-vant/icons';
export default function index() {
    return (
        <div>
            <Search placeholder="请输入搜索关键词" />
            <div className="demo-swiper">
                <Swiper autoplay={2000}>
                    {images.map((image) => (
                        <Swiper.Item key={image}>
                            <Image lazyload src={image} />
                        </Swiper.Item>
                    ))}
                </Swiper>
            </div>
            <div>
                <h3>推荐</h3>
                <div className='contain'>
                    <div className='img'>
                        <img src={require("../../images/u17.png")} />
                        <span>三亚后海冲浪攻略！380冲浪+浮潜</span>
                        <div className='author'><div><img src={require("../../images/u971.png")} /><span>Amor</span></div><div><Rate size="20" count={1} voidIcon={<LikeO />} icon={<Like />} /><span>111</span></div></div>
                    </div>
                    <div className='img'>
                        <img src={require("../../images/u19.png")} />
                        <span>三亚后海冲浪攻略！380冲浪+浮潜</span>
                        <div></div>
                    </div>
                </div>
            </div>
        </div>
    )
}
